<style lang="less">
    @import "../../../../styles/common.less";
</style>
<template>
    <Modal v-model="testModel" :width="1000" :closable="false" :mask-closable="false">
        <div class="clearfix">
            <p slot="title" style="padding-bottom: 16px">
                可选组合症状：
            </p>
            <Row>
                <i-col span="24">
                    <!-- 症状部位二级 -->
                    <i-col span="3" >
                        <Select v-model="positionId" @on-change="searchPositionState" clearable style="width:120px" placeholder="部位">
                            <Option v-for="item in buWeiList" :value="item.id" :key="item.dataValue">{{ item.dataValue }}</Option>
                        </Select>
                    </i-col>
                    <!-- 症状部位三级 -->
                    <i-col span="3" >
                        <Select v-model="positionthreeId" @on-change="searchthreeState" clearable style="width:120px" placeholder="请选择症状部位">
                            <Option v-for="item in buWeizijiList" :value="item.id" :key="item.dataValue">{{ item.dataValue }}</Option>
                        </Select>
                    </i-col>
                    <!-- 症状寒热 -->
                    <i-col span="3" >
                        <Select v-model="zhengZhuangHanRe" @on-change="searchZhengZhuangHanRe" clearable style="width:120px" placeholder="寒热">
                            <Option v-for="item in hanReList" :value="item.id" :key="item.dataValue">{{ item.dataValue }}</Option>
                        </Select>
                    </i-col>
                    <!-- 症状表里 -->
                    <i-col span="3" >
                        <Select v-model="zhengZhuangBiaoLi" @on-change="searchZhengZhuangBiaoLi" clearable style="width:120px" placeholder="表里">
                            <Option v-for="item in bingWeiList" :value="item.id" :key="item.dataValue">{{ item.dataValue }}</Option>
                        </Select>
                    </i-col>
                    <!-- 症状三焦 -->
                    <i-col span="3" >
                        <Select v-model="zhengZhuangSanJiao" @on-change="searchZhengZhuangSanJiao"  clearable style="width:120px" placeholder="三焦">
                            <Option v-for="item in sanJiaoList" :value="item.id" :key="item.dataValue">{{ item.dataValue }}</Option>
                        </Select>
                    </i-col>
                    <!-- 病理产物 -->
                    <!-- <i-col span="3" >
                        <Select v-model="bingLiChanWu" @on-change="searchBingLiChanWu" clearable style="width:120px" placeholder="病理产物">
                            <Option v-for="item in bingLiChanWuList" :value="item.id" :key="item.dataValue">{{ item.dataValue }}</Option>
                        </Select>
                    </i-col> -->
                    <!-- 症状类型 -->
                    <!-- <i-col span="3" >
                        <Select v-model="classifyType" @on-change="searchZhengZhuangLeiXing"  clearable style="width:120px" placeholder="类型">
                            <Option v-for="item in classifyTypeList" :value="item.id" :key="item.dataValue">{{ item.dataValue }}</Option>
                        </Select>
                    </i-col> -->
                    <!-- 检索症状  -->
                    <i-col span="3" >
                         <Input  v-model="zhengZhuangName"  @on-change="searchZhengZhuangName" placeholder="名称关键词" icon="search" style="width: 120px" />
                    </i-col>
                    <i-col span="2">
                        <Button  @click="emptySearch" v-bind:style="{width: 90 + 'px' }" type="primary">清空检索</Button>
                    </i-col>
                </i-col>
            </Row>
            <br>
            <div>
                <Table border ref="selection" :loading="address_loading" :columns="list" :data="tableData" @on-select="getSel" @on-select-all="selectAll" @on-select-cancel="selectCancel"></Table>
            </div>
            <Page ref="pages" :total="itemTotal" show-total style="float: right; margin-top: 20px" @on-change="getList"></Page>
        </div>
        <div slot="footer">
            <div>
                <Button type="success" style="margin:0 auto; display: block;"  @click="sureModel">确定</Button>
                <!-- <Button type="primary" @click="hideModel">取消</Button> -->
            </div>
         </div>
    </Modal>
</template>

<script>
import ajax from "../../../../libs/axios.js"
export default {
    name: 'symptomindex',
    props: {
        testModel: Boolean,
        selectModel: Array
    },
    data () {
        return {
            address_loading: false,
            list: [
                {
                    type: 'selection',
                    width: 60,
                    align: 'center'
                },
                {
                    title: '部位',
                    align: 'center',
                    key: 'zhengzhuangname',
                    editable: true
                },
                {
                    title: '名称',
                    align: 'center',
                    key: 'zhengzhuang',
                    editable: true
                },
                {
                    title: '寒热',
                    align: 'center',
                    key: 'zhengzhuanghanrename',
                    editable: true
                },
                {
                    title: '表里',
                    align: 'center',
                    key: 'zhengzhuangbiaoliname',
                    editable: true
                },
                {
                    title: '三焦',
                    align: 'center',
                    key: 'zhengzhuangsanjiaoname',
                    editable: true
                },
                {
                    title: '病理产物',
                    align: 'center',
                    key: 'binglichanwuname',
                    editable: true
                },
                {
                    title: '类型',
                    align: 'center',
                    key: 'classifyTypeStr',
                    editable: true
                }
            ],
            data: [],
            selectData: [],
            itemTotal: 0,
            searchvalue: '',
            tableData: [],
            // 下拉绑定属性
            positionId: '',
            positionthreeId: '',
            zhengZhuangHanRe: '',
            zhengZhuangBiaoLi: '',
            zhengZhuangSanJiao: '',
            description: '',
            bingLiChanWu: '',
            zhongQiZaoRe: '',
            zhengZhuangName: '',
            // 下拉选项数据
            buWeiList: [],
            buWeizijiList: [],
            hanReList: [],
            bingWeiList: [],
            sanJiaoList: [],
            bingLiChanWuList: [],
            zhongQiZaoShiList: [],

            // 症状类型
            classifyType:'',
            classifyTypeList:[
                {
                    "id":3,
                    "dataValue":"全部"
                },
                {
                    "id":1,
                    "dataValue":"症状"
                },
                {
                    "id":2,
                    "dataValue":"附加属性"
                }
            ]
        }
    },
    methods: {
        init () {
            this.getOptionData()
            this.getList("1")
        },
        // 获取选项数据
        getOptionData () {
            let url = '/adminapi/datamanagement/symptomdatabase/optionData.html'
            ajax.jsonRes(url).then(res => {
                // success
                this.buWeiList = res.buWeiList
                this.hanReList = res.hanReList
                this.bingWeiList = res.bingWeiList
                this.sanJiaoList = res.sanJiaoList
                this.bingLiChanWuList = res.bingLiChanWuList
                this.zhongQiZaoShiList = res.zhongQiZaoShiList
            }).catch(res => {
                console.log('获取症状获取选项数据有错误信息')
                // fail
            })
        },
        hideModel () {
            this.$emit('hideModel', false)
        },
        sureModel () {
            this.$emit('hideModel', false)
            this.$emit('selectFunction', this.selectModel)
        },
        getSel (seletion, row) {
            console.log("getSel执行中。。。")
            this.selectModel.push({
                id: row.id,
                description: row.zhengzhuang
            })
        },
        selectAll (seletion) { // 点击全选时触发
            console.log("selectAll执行中。。。")
            seletion.forEach(item => {
                this.selectModel.push({
                    id:item.id,
                    description: item.zhengzhuang
                })
            })
        },
        selectCancel (seletion, row) {
            let _selets = this.selectModel
            // 从选种的集合中删除数据
            for (var i = _selets.length - 1; i >= 0; i--) {
                if (_selets[i].id === row.id) {
                    _selets.splice(i,1)
                }
            }
        },
        getList (page) {
            console.log("this.selectModel")
            console.log(this.selectModel)
            let url = "/adminapi/datamanagement/symptomdatabase/symptomDatabaseList.html"
            let data = {
                tel: this.searchvalue,
                pageSize:10,
                pageNumber: page,
                querySymptomType:1
            }
            ajax.jsonRes(url, data).then(res => {
                this.itemTotal = res.recordCount
                this.tableData = res.list
                // 1、循环获取的数据
                this.tableData.forEach(item => {
                    // 2、循环选中的数据
                    for (let sdata of this.selectModel) {
                        // 3、比较数据，如果相等，则默认选中
                        if (sdata.id === item.id) {
                            item._checked = true
                        }
                    }
                })
            })
                .catch(res => {
                    console.log("有错误信息")
                    // fail
                })
        },
        /** *************************检索***************************** */
        // 检索部位一级
        searchPositionState () {
            console.log(this.positionId)
            this.querySubset(this.positionId)
            // 检索部位
            this.searchMethod(1)
        },
        // 查询子集
        querySubset (positionId) {
            let url = '/adminapi/datamanagement/symptomdatabase/optionFid.html'
            let data = {
                pid: positionId
            }
            ajax.jsonRes(url, data).then(res => {
                // success
                console.log('--------------------------------------------')
                console.log(res)
                this.buWeizijiList = res
            }).catch(res => {
                console.log('获取症状数据有错误信息')
                // fail
            })
        },
        // 检索部位二级
        searchthreeState () {
            console.log(this.positionthreeId)
            this.searchMethod(1)
        },
        // 检索症状寒热
        searchZhengZhuangHanRe () {
            console.log(this.zhengZhuangHanRe)
            this.searchMethod(1)
        },
        // 检索症状表里（病理）
        searchZhengZhuangBiaoLi () {
            console.log(this.zhengZhuangBiaoLi)
            this.searchMethod(1)
        },
        // 检索症状三焦
        searchZhengZhuangSanJiao () {
            console.log(this.zhengZhuangSanJiao)
            this.searchMethod(1)
        },
        // 检索病理产物
        searchBingLiChanWu () {
            console.log(this.bingLiChanWu)
            this.searchMethod(1)
        },
        // 检索症状类型
        searchZhengZhuangLeiXing () {
            this.searchMethod(1)
        },
        // 检索中气燥热
        searchZhongQZaoRe () {
            console.log(this.zhongQiZaoRe)
            this.searchMethod(1)
        },
        // 检索症状关键词
        searchZhengZhuangName () {
            this.searchMethod(1)
        },
        // 清空检索字段
        emptySearch () {
            this.positionId = ''
            this.zhengZhuangHanRe = ''
            this.zhengZhuangBiaoLi = ''
            this.zhengZhuangSanJiao = ''
            this.bingLiChanWu = ''
            this.zhengZhuangName = ''
            this.classifyType = ''
        },
        // 检索方法
        searchMethod (page) {
            let url = '/adminapi/datamanagement/symptomdatabase/symptomDatabaseList.html'
            let data = {
                zhengzhuangbuweione: this.positionId,
                zhengzhuangbuweitwo: this.positionthreeId,
                zhengzhuanghanre: this.zhengZhuangHanRe,
                zhengzhuangbiaoli: this.zhengZhuangBiaoLi,
                zhengzhuangsanjiao: this.zhengZhuangSanJiao,
                binglichanwu: this.bingLiChanWu,
                zhengzhuang: this.zhengZhuangName,
                pageNumber: page,
                pageSize: 10,
                querySymptomType:this.classifyType
            }
            ajax.jsonRes(url, data).then(res => {
                // success
                // this.columnsList = columnsLists.table1Columns;
                this.tableData = res.list
                this.itemTotal = res.recordCount
                // 1、循环获取的数据
                this.tableData.forEach(item => {
                    // 2、循环选中的数据
                    for (let sdata of this.selectModel) {
                        // 3、比较数据，如果相等，则默认选中
                        if (sdata.id === item.id) {
                            item._checked = true
                        }
                    }
                })
            }).catch(res => {
                console.log('获取症状数据有错误信息')
                // fail
            })
        }
    },
    mounted () {
        this.init()
    }
    // created 进入页面初始化一次    activated每次进入页面都初始化
    // activated () {
    //     this.init()
    // }
}
</script>
